import React, { PureComponent } from 'react';
import { PageContainer } from '@ant-design/pro-layout';
import { Card, Tabs } from 'antd';
import { history } from 'umi'
import { UserOutlined, FormOutlined, DeploymentUnitOutlined, LockOutlined, UserSwitchOutlined, MoneyCollectOutlined } from '@ant-design/icons';
import AuditUsers from './AuditUsers/index';
import OverdueUsers from './OverdueUsers/index';
import PayUsers from './PayUsers/index';
// import SignIn from './SignIn/index';
import UserManagement from './UserManagement/index';
import Position from './Position/index';
import RoleManagement from './RoleManagement/index';
// import GroupManagement from './GroupManagement/index';
// import UnitStructure from './UnitStructure/index';
import { getType, getPositonSelect } from '../../services/peoples'
import { getSubject } from '../../services/lessons'
import Authorized from '../../components/Authorized/Authorized'
import { isZhongZheng } from '../../utils/utils';
const TabPane = Tabs.TabPane;

export default class Index extends PureComponent<any, any> {
    constructor(props: any) {
        super(props);
        this.state = {
            currentTab: window.location.hash[window.location.hash.length - 1],
            options: [],
            positionData: [],
            lessonsData: []
        };
    }
    changeTabHandle = (e: string) => {
        this.setState({
            currentTab: e
        })
        if (this.props.location.pathname.indexOf('tzPeoples') === -1) {
            history.push('/peopleManagement/peoples/' + e)
        } else {
            history.push('/peopleManagement/tzPeoples/' + e)
        }
    }
    renderType = () => {
        const currentTab = this.props.match.params.tab === ':tab' ? '1' : this.props.match.params.tab
        getType().then((res) => {
            if (!res || !res[0]) return;
            let data = JSON.stringify(res);
            data = data
                .replace(/id/g, 'value')
                .replace(/title/g, 'label')
                .replace(/pvalue/g, 'pid');
            const options = JSON.parse(data)
            let student_type = JSON.parse(localStorage.getItem('userinfo') || '{}').student_type;
            student_type = student_type ? student_type.split(',') : [];
            if (isZhongZheng() && !student_type[1]) {
                options[0].children.push({ label: "其他", level: 2, pvalue: 1, num: 2, value: -1 })
            }
            this.setState({
                options
            });
        });
    }
    componentDidMount() {
        const currentTab = this.props.match.params.tab === ':tab' ? '1' : this.props.match.params.tab
        this.setState({
            currentTab
        })
        this.renderType()
        getPositonSelect().then(res => {
            if (!res || !res[0]) return;
            this.setState({
                positionData: res
            })
        })
        getSubject().then(res => {
            if (!res || !res[0]) return;
            let data = JSON.stringify(res);
            data = data
                .replace(/id/g, 'value')
                .replace(/pvalue/g, 'pid')
                .replace(/"pid":0,/g, '"pid":0,"selectable":false,"checkable":false,')
            // .replace(/"children":/g, '"checkable":false,"selectable":false,"children":')
            // .replace(/"checkable":false,"selectable":false,"children":\[\]/g, '"children":[]')
            const lessonsData = JSON.parse(data)
            this.setState({
                lessonsData
            })
        })
    }

    render() {
        const { currentTab, options, positionData, lessonsData } = this.state;
        const renderChild = (currentTab: string) => {
            switch (currentTab) {
                // case '2':
                //     return <GroupManagement />;
                // case '3':
                //     return <Authorized authority={[106,906]}> <UnitStructure /></Authorized>;
                case '2':
                    return <Authorized authority={[107, 907]}> <Position /></Authorized>;
                case '3':
                    return <Authorized authority={[119, 919]}><AuditUsers baoming={'0'}  options={options} positionData={positionData} lessonsData={lessonsData} /></Authorized>;
                case '4':
                    return <Authorized authority={[115, 116, 117, 915, 916, 917]}><PayUsers baoming={'0'} options={options} positionData={positionData} lessonsData={lessonsData} /></Authorized>;
                case '5':
                    return <Authorized authority={[109, 909]}> <AuditUsers baoming={'1'} options={options} positionData={positionData} lessonsData={lessonsData} /></Authorized>;
                case '6':
                    return <Authorized authority={[109, 909]}> <RoleManagement /></Authorized>;
                case '7':
                    return <Authorized authority={[119, 919]}><OverdueUsers baoming={'0'} options={options} positionData={positionData} lessonsData={lessonsData} /></Authorized>;
                default:
                    return <Authorized authority={[101, 901]}><UserManagement options={options} positionData={positionData} lessonsData={lessonsData} renderType={this.renderType} /></Authorized>
            }
        }
        const tabPane = [<TabPane key="1" tab={<span><UserOutlined />用户管理</span>}></TabPane>,
        <TabPane key="2" tab={<span><DeploymentUnitOutlined />职务岗位</span>}></TabPane>,
        <TabPane key="3" tab={<span><LockOutlined />{isZhongZheng() ? '已完成用户' : '审核用户'}</span>}></TabPane>,
        <TabPane key="7" tab={<span><LockOutlined />超期用户</span>}></TabPane>,
        <TabPane key="4" tab={<span><MoneyCollectOutlined />缴费用户</span>}></TabPane>,
        <TabPane key="5" tab={<span><FormOutlined />报名用户</span>}></TabPane>,
        <TabPane key="6" tab={<span><UserSwitchOutlined />角色管理</span>}></TabPane>]
        if (!isZhongZheng()) tabPane.splice(3, 1)
        if (!isZhongZheng()) tabPane.splice(3, 1)
        return (
            <PageContainer>
                <Card>
                    <Tabs onChange={this.changeTabHandle} activeKey={currentTab}>
                        {
                            tabPane.map(item => {
                                return item
                            })
                        }
                    </Tabs>
                    {renderChild(currentTab)}
                </Card>
            </PageContainer>
        );
    }
}
